<a href="" uib-dropdown-toggle class="dropdown-toggle">
	<i class="ace-icon fa fa-tasks"></i>
	<span class="badge badge-grey" ng-bind="::getCommonData('navbar').tasks.count"></span>
</a>

<ul class="dropdown-menu-right dropdown-navbar dropdown-menu dropdown-caret dropdown-close">
	<li class="dropdown-header">
		<i class="ace-icon fa fa-check"></i> {{::getCommonData('navbar').tasks.count}} Tasks to complete
	</li>

	<li class="dropdown-content" ace-scroll options="{'size': 200, 'mouseWheelLock': true, 'reset': false}">
		<ul class="dropdown-menu dropdown-navbar">
			<li ng-repeat="task in ::getCommonData('navbar').tasks.latest">
				<a href="">
					<div class="clearfix">
						<span class="pull-left">{{task.title}}</span>
						<span class="pull-right">{{task.percentage}}%</span>
					</div>
					<uib-progressbar ng-class="['progress-mini' , task['progress-class'] || '']" value="task.percentage" type="{{task['progress-bar-type']}}"></uib-progressbar>
				</a>
			</li>
		</ul>
	</li>

	<li class="dropdown-footer">
		<a href="">
			See tasks with details
			<i class="ace-icon fa fa-arrow-right"></i>
		</a>
	</li>
</ul>
